<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <title>日新网 - 蓝图</title>
    <link rel="stylesheet" href="/public/swiper/swiper.min.css">
</head>
<body>
<tc_include file="scripts"/>
<tc_include file="Public:nav"/>

<div class="lantu-info">
    <div class="top-img">
        <img src="{:sp_get_asset_upload_path($subject_info['icon'])}" alt="">
        <div class="text">
            <p class="p1">{$subject_info['name']}</p>
        </div>
    </div>
    <div class="content">
        <div class="introduce ellipsis5">{$subject_info['policy']}</div>
        <div class="info-content">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <!--<if condition="!empty($lesson_subject_lists)">-->
                        <!--<div class="swiper-slide active" tab="tab1">专题课程</div>-->
                    <!--</if>-->
                    <if condition="!empty($articles)">
                        <div class="swiper-slide {$active == 1 ? 'active' : ''}" tab="tab2">相关文章</div>
                    </if>
                    <if condition="!empty($services)">
                        <div class="swiper-slide {$active == 2 ? 'active' : ''}" tab="tab3">日新商脉</div>
                    </if>
                    <if condition="!empty($cases)">
                        <div class="swiper-slide {$active == 3 ? 'active' : ''}" tab="tab4">行业案例</div>
                    </if>
                    <if condition="!empty($activitys)">
                        <div class="swiper-slide {$active == 4 ? 'active' : ''}" tab="tab5">线下活动</div>
                    </if>
                </div>
            </div>
            <!--<if condition="!empty($lesson_subject_lists)">-->
                <!--<div class="h3-title" style="margin-top: -5px;" id="tab1">专题课程</div>-->
                <!--<div class="course">-->
                    <!--<volist name="lesson_subject_lists" id="vo">-->
                        <!--<a href="{:U('Lesson/Lesson/lesson_list', ['subject_id' => $vo['id']])}">-->
                            <!--<div class="course-item flex">-->
                                <!--<div class="img-ground">-->
                                    <!--<img src="{:sp_get_asset_upload_path($vo['subject_img'])}" alt="">-->
                                    <!--<div class="course-icon">试看</div>-->
                                <!--</div>-->
                                <!--<div class="course-text">-->
                                    <!--<p class="title ellipsis1">课程名称，只留一行</p>-->
                                    <!--<p class="name"><span>主讲人:</span><span>哈哈哈</span></p>-->
                                <!--</div>-->
                            <!--</div>-->
                        <!--</a>-->
                    <!--</volist>-->
                <!--</div>-->
            <!--</if>-->

            <if condition="!empty($articles)">
                <div class="h3-title" id="tab2">相关文章</div>
                <div class="tab_content">
                    <volist name="articles" id="vo">
                        <php>
                            $smeta = json_decode($vo['smeta'], true);
                        </php>
                        <a href="{:U('Portal/Article/article_info', ['id' => $vo['id']])}">
                            <div class="tab_content_item">
                                <div class="tab_img">
                                    <img src="{:sp_get_asset_upload_path($smeta['thumb'])}" alt="">
                                </div>
                                <div class="tab_text">
                                    <p class="text_top ellipsis3">{$vo.post_title}</p>
                                    <div class="text_sub">
                                        <volist name="vo.label_names" id="vo_label_name">
                                            <span>{$vo_label_name}</span>
                                        </volist>
                                        <p>
                                            <span>{:time_format($vo['post_date'])}</span>
                                            <span class="timer">{$vo.post_author_name}</span>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </volist>
                </div>
            </if>

            <if condition="!empty($services)">
                <div class="h3-title" style="margin-top: -.48rem;" id="tab3">日新商脉</div>
                <div class="business">
                    <volist name="services" id="vo">
                        <a href="{:U('Service/Index/service_info', ['id' => $vo['id']])}">
                            <div class="business-item">
                                <div class="img-ground">
                                    <img src="{:sp_get_image_preview_url($vo['logo'])}" alt="">
                                </div>
                                <div class="text">
                                    <p class="p1"><span class="span1">{$vo.company_name}</span><span class="span2">{$vo['financing']['round']}</span></p>
                                    <p class="p2 ellipsis1">{$vo.company_desc}</p>
                                </div>
                            </div>
                        </a>
                    </volist>
                </div>
            </if>

            <if condition="!empty($cases)">
                <div class="h3-title" style="margin-top: -.28rem;" id="tab4">行业案例</div>
                <div class="tab_content">
                    <volist name="cases" id="vo">
                        <php>
                            $smeta = json_decode($vo['smeta'], true);
                        </php>
                        <a href="{:U('Portal/Article/article_info', ['id' => $vo['id']])}">
                            <div class="tab_content_item">
                                <div class="tab_img">
                                    <img src="{:sp_get_asset_upload_path($smeta['thumb'])}" alt="">
                                </div>
                                <div class="tab_text">
                                    <p class="text_top ellipsis3">{$vo.post_title}</p>
                                    <div class="text_sub">
                                        <volist name="vo.label_names" id="vo_label_name">
                                            <span>{$vo_label_name}</span>
                                        </volist>
                                        <p>
                                            <span>{$vo.post_author_name}</span>
                                            <span class="timer">{:time_format($vo['post_date'])}</span>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </volist>
                </div>
            </if>

            <if condition="!empty($activitys)">
                <div class="h3-title" style="margin-top: -.48rem;" id="tab5">线下活动</div>
                <div class="activity">
                    <volist name="activitys" id="vo">
                        <a href="{$vo.link_addr}">
                            <div class="activity-item">
                                <div class="img-ground">
                                    <img src="{:sp_get_asset_upload_path($vo['thumb']['thumb'])}" alt="">
                                    <div class="activity-icon">报名中</div>
                                </div>
                                <div class="text">
                                    <p class="name"><span class="span1">{$vo.form_type_name}</span><span class="span2">{$vo.city_name}</span></p>
                                    <p class="title ellipsis2">{$vo.name}</p>
                                    <p class="key-word">{$vo['label_names'][0]}</p>
                                    <p class="timer">{$vo.start_time} - {$vo.end_time}</p>
                                </div>
                            </div>
                        </a>
                    </volist>
                </div>
            </if>
        </div>
    </div>
</div>
<!-- JavaScript -->
<tc_include file="Public:footer"/>
<script type="text/javascript" src="__TMPL__Public/assets/js/jquery.1.12.4.js"></script>
<script src="/public/swiper/swiper.min.js"></script>
<!--<script src="__TMPL__Public/assets/js/jquery.infiniteScroll.js"></script>-->
<!--<script src="__PUBLIC__/js/layer/layer_1.js"></script>-->
<!--<script src="__PUBLIC__/js/area.js"></script>-->
<script>
    $(function () {
        $(".swiper-slide").each(function (index,value) {
            $(value).click(function (e) {
                $(this).addClass("active").siblings().removeClass("active")
                goScrollTop(e);
            })
        })
        $(window).on("scroll",fiexdTop)
    })
    function fiexdTop() {
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        if (scrollTop > 300){
            $(".swiper-container").addClass("active")
        }else{
            $(".swiper-container").removeClass("active")
        }
    }
    function goScrollTop(e) {
        var id = e.currentTarget.getAttribute("tab")
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        var totle =document.getElementById(id).offsetTop - scrollTop + 150 ;
        var step =  Math.ceil(totle / 10 );
        var timer = setInterval(function () {
            if(Math.abs(step) < Math.abs(totle)){
                window.scrollTo(0,scrollTop + step);
                step += step;
            } else {
                clearInterval(timer)
                window.scrollTo(0,document.getElementById(id).offsetTop + 150);
            }
        },50)
    }
</script>
<script>
    var mySwiper = new Swiper ('.swiper-container', {
        direction: 'horizontal', // vertical垂直切换选项
        // loop: true, // 循环模式选项
        width:70
    })
</script>
</body>
</html>